<template>
  <!--明细页面弹出框-->
  <el-dialog
    title="实时借记业务查询明细"
    center
    :visible.sync="open"
    width="1024px"
    :close-on-click-modal="true"
    @close="closeFn"
  >
    <el-form ref="detailsForm" :model="formData" label-width="140px">
      <el-card class="form-card txnInfo-card">
        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="交易流水号：" prop="id">
              <el-input v-model="formData.id" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="报文标识号：" prop="pkgId">
              <el-input v-model="formData.pkgId" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="明细标识号：" prop="dtlNo">
              <el-input v-model="formData.dtlNo" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="系统编号：" prop="sysCode">
              <el-select v-model="formData.sysCode" placeholder="记账标志" disabled style="width: 100%">
                <el-option
                  v-for="dict in dictMap.SYSTEMCODE"
                  :key="dict.value"
                  :label="`${dict.value}-${dict.text}`"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="来往账标识：" prop="drct">
              <el-select v-model="formData.drct" placeholder="" style="width: 100%" disabled>
                <el-option
                  v-for="dict in dictMap.DRCTCODE"
                  :key="dict.value"
                  :label="`${dict.value}-${dict.text}`"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="内部机构号：" prop="brno">
              <el-input v-model="formData.brno" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="来源：" prop="source">
              <el-select v-model="formData.source" placeholder="" style="width: 100%" disabled>
                <el-option
                  v-for="dict in dictMap.TXN_SOURCE"
                  :key="dict.value"
                  :label="`${dict.value}-${dict.text}`"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="CPG日期：" prop="vdate">
              <el-date-picker
                v-model="formData.vdate"
                type="date"
                disabled
                value-format="yyyyMMdd"
                placeholder=""
                style="width: 100%"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="工作日期：" prop="workdate">
              <el-date-picker
                v-model="formData.workdate"
                type="date"
                disabled
                value-format="yyyyMMdd"
                placeholder=""
                style="width: 100%"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="业务类型：" prop="bizTypeCode">
              <el-select v-model="formData.bizTypeCode" placeholder="" disabled style="width: 100%">
                <el-option
                  v-for="dict in dictMap.BIZ_TYPE"
                  :key="dict.value"
                  :label="`${dict.value}-${dict.text}`"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="业务种类：" prop="bizCtgyCode">
              <el-select v-model="formData.bizCtgyCode" placeholder="请选择" style="width: 100%" disabled>
                <el-option
                  :label="`${formData.bizCtgyCode}-${formData.bizCtgyCodeDesc}`"
                  :value="formData.bizCtgyCode"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </el-card>
      <el-card class="form-card txnInfo-card">
        <el-row>
          <el-col :span="12">
            <el-form-item label="收款人账号：" prop="payeeActno">
              <el-input v-model="formData.payeeActno" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="收款人名称：" prop="payeeName">
              <el-input v-model="formData.payeeName" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="收款人地址：" prop="payeeAddr">
              <el-input v-model="formData.payeeAddr" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="收款行行号：" prop="payeeBrno">
              <el-input v-model="formData.payeeBrno" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="收款行行名：" prop="payeeBrname">
              <el-input v-model="formData.payeeBrname" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="收款人开户行行号：" prop="payeeAccBrno">
              <el-input v-model="formData.payeeAccBrno" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="收款人开户行行名：" prop="payeeAccBrname">
              <el-input v-model="formData.payeeAccBrname" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
      </el-card>
      <el-card class="form-card txnInfo-card">
        <el-row>
          <el-col :span="12">
            <el-form-item label="付款行行号：" prop="payerBrno">
              <el-input v-model="formData.payerBrno" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="付款行行名：" prop="payerBrname">
              <el-input v-model="formData.payerBrname" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="付款人开户行行号：" prop="payerAccBrno">
              <el-input v-model="formData.payerAccBrno" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="付款人开户行行名：" prop="payerAccBrname">
              <el-input v-model="formData.payerAccBrname" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="付款人账号：" prop="payerActno">
              <el-input v-model="formData.payerActno" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="付款人名称：" prop="payerName">
              <el-input v-model="formData.payerName" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="付款人地址：" prop="payerAddr">
              <el-input v-model="formData.payerAddr" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
      </el-card>

      <el-card class="form-card txnInfo-card">
        <el-row>
          <el-col :span="12">
            <el-form-item label="代理行手续费货币：" prop="proxyCurcd">
              <el-input v-model="formData.proxyCurcd" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="代理行手续费：" prop="proxyFee">
              <el-input v-model="formData.proxyFee" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="交易币种：" prop="curcd">
              <el-input v-model="formData.curcd" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="交易金额：" prop="amount">
              <el-input v-model="formData.amount" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="合同（协议）号：" prop="protoId">
              <el-input v-model="formData.protoId" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="地域标识：" prop="regionid">
              <el-select v-model="formData.regionid" placeholder="" disabled style="width: 100%">
                <el-option
                  v-for="dict in dictMap.RegionId"
                  :key="dict.value"
                  :label="`${dict.value}-${dict.text}`"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </el-card>
      <el-card
        class="form-card txnInfo-card"
        v-if="this.formData.bizTypeCode === 'D203' || this.formData.bizTypeCode ==='D204' || this.formData.bizTypeCode ==='D205' || this.formData.bizTypeCode ==='D206'"
      >
        <div slot="header" class="label-header-msg">
          <span>实时通用票据截留业务附加数据</span>
        </div>
        <el-row>
          <el-col :span="12">
            <el-form-item label="出票日期：" prop="issueDate">
              <el-date-picker
                v-model="formData.issueDate"
                type="date"
                disabled
                value-format="yyyyMMdd"
                placeholder=""
                style="width: 100%"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="出票货币币种：" prop="issueCurcd">
              <el-input v-model="formData.issueCurcd" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="出票金额：" prop="issueAmount">
              <el-input v-model="formData.issueAmount" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="提示付款日期：" prop="payDate">
              <el-date-picker
                v-model="formData.payDate"
                type="date"
                disabled
                value-format="yyyyMMdd"
                placeholder=""
                style="width: 100%"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="票据到期日期：" prop="draftMaturity">
              <el-date-picker
                v-model="formData.draftMaturity"
                type="date"
                disabled
                value-format="yyyyMMdd"
                placeholder=""
                style="width: 100%"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="票据号码：" prop="noteNumber">
              <el-input v-model="formData.noteNumber" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="支付密码：" prop="payPassword">
              <el-input v-model="formData.payPassword" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="票据密押：" prop="draftKey">
              <el-input v-model="formData.draftKey" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="承兑协议编号：" prop="protoNo">
              <el-input v-model="formData.protoNo" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="承兑日期：" prop="acceptDate">
              <el-date-picker
                v-model="formData.acceptDate"
                type="date"
                disabled
                value-format="yyyyMMdd"
                placeholder=""
                style="width: 100%"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="承兑人：" prop="acceptor">
              <el-input v-model="formData.acceptor" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="申请人账号：" prop="applyAccount">
              <el-input v-model="formData.applyAccount" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="申请人名称：" prop="applyName">
              <el-input v-model="formData.applyName" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="出票人账号：" prop="issueAccount">
              <el-input v-model="formData.issueAccount" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="出票人全称：" prop="issueName">
              <el-input v-model="formData.issueName" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="交易合同号码：" prop="pactNumber">
              <el-input v-model="formData.pactNumber" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="用途：" prop="useto">
              <el-input v-model="formData.useto" placeholder="" type="textarea" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="原收款人名称：" prop="oriPayeeName">
              <el-input v-model="formData.oriPayeeName" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
      </el-card>
      <el-card
        class="form-card txnInfo-card"
        v-if="this.formData.bizTypeCode === 'D203' || this.formData.bizTypeCode ==='D204' || this.formData.bizTypeCode ==='D205' || this.formData.bizTypeCode ==='D206'"
      >
        <div slot="header" class="label-header-msg">
          <span>被背书人清单</span>
        </div>
        <el-row>
          <el-col :span="12">
            <el-form-item label="被背书人数：" prop="endorserNumber">
              <el-input v-model="formData.endorserNumber" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <ht-table
          ref="dataTable"
          :showSerialNumber="false"
          :multi-select="false"
          :dictMap="dictMap"
          :initData="false"
          :reqConfig="reqConfig"
          :queryParams="queryParams"
          :tableBindColumns="tableBindColumns"
          :showRightToolbar="false"
          defaultEventKey="detailsTable"
          style="height: 240px"
        ></ht-table>
      </el-card>
      <el-card class="form-card txnInfo-card" v-if="this.formData.bizTypeCode == 'D102'">
        <div slot="header" class="label-header-msg">
          <span>通存业务附加数据域</span>
        </div>
        <el-row>
          <el-col :span="12">
            <el-form-item label="地域标识：" prop="regionid">
              <el-select v-model="formData.regionid" placeholder="" disabled style="width: 100%">
                <el-option
                  v-for="dict in dictMap.RegionId"
                  :key="dict.value"
                  :label="`${dict.value}-${dict.text}`"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="磁介质类型：" prop="mediumType">
              <el-select v-model="formData.mediumType" placeholder="" disabled style="width: 100%">
                <el-option
                  v-for="dict in dictMap.Medium_Type_Code"
                  :key="dict.value"
                  :label="`${dict.value}-${dict.text}`"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="磁道信息数目：" prop="mediumNum">
              <el-input v-model="formData.mediumNum" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <div class="grid-otherInfo">
              <el-form-item label="磁道信息1：" prop="mediumInfo1">
                <el-input type="textarea" v-model="formData.mediumInfo1" placeholder="" disabled />
              </el-form-item>
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <div class="grid-otherInfo">
              <el-form-item label="磁道信息2：" prop="mediumInfo2">
                <el-input type="textarea" v-model="formData.mediumInfo2" placeholder="" disabled />
              </el-form-item>
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <div class="grid-otherInfo">
              <el-form-item label="磁道信息3：" prop="mediumInfo3">
                <el-input type="textarea" v-model="formData.mediumInfo3" placeholder="" disabled />
              </el-form-item>
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="卡序号：" prop="cardNum">
              <el-input v-model="formData.cardNum" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="IC卡信息：" prop="cardInfo">
              <el-input v-model="formData.cardInfo" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="证件类型：" prop="idType">
              <el-select v-model="formData.idType" placeholder="" disabled style="width: 100%">
                <el-option
                  v-for="dict in dictMap.Id_Type_Code"
                  :key="dict.value"
                  :label="`${dict.value}-${dict.text}`"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="证件号码：" prop="idNum">
              <el-input v-model="formData.idNum" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
      </el-card>
      <el-card class="form-card txnInfo-card">
        <el-row type="flex">
          <el-col :span="12">
            <el-form-item label="回执交易流水号" prop="rtId">
              <el-input v-model="formData.rtId" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="回执报文标识号" prop="rtPkgId">
              <el-input v-model="formData.rtPkgId" disabled/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="回执业务状态：" prop="rtBizStatus">
              <el-select v-model="formData.rtBizStatus" placeholder="" disabled style="width: 100%">
                <el-option
                  v-for="dict in dictMap.TXN_STATUS"
                  :key="dict.value"
                  :label="`${dict.value}-${dict.text}`"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="回执通讯状态：" prop="rtStatus">
              <el-select v-model="formData.rtStatus" placeholder="" disabled style="width: 100%">
                <el-option
                  v-for="dict in dictMap.PKG_STATUS"
                  :key="dict.value"
                  :label="`${dict.value}-${dict.text}`"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="交易币种：" prop="curcd2">
              <el-input v-model="formData.curcd2" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="结算金额：" prop="amount2">
              <el-input v-model="formData.amount2" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="NPC轧差日期：" prop="chkDate">
              <el-date-picker
                v-model="formData.chkDate"
                type="date"
                disabled
                value-format="yyyyMMdd"
                placeholder=""
                style="width: 100%"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="NPC轧差场次：" prop="chkRound">
              <el-input v-model="formData.chkRound" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="业务回执状态：" prop="bizRtStatus">
              <el-select v-model="formData.bizRtStatus" placeholder="" disabled style="width: 100%">
                <el-option
                  v-for="dict in dictMap.BIZRT_STATUS"
                  :key="dict.value"
                  :label="`${dict.value}-${dict.text}`"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="NPC清算日期：" prop="clrDate">
              <el-date-picker
                v-model="formData.clrDate"
                type="date"
                disabled
                value-format="yyyyMMdd"
                placeholder=""
                style="width: 100%"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="业务拒绝处理码：" prop="rejectCode">
              <el-select v-model="formData.rejectCode" placeholder="" disabled style="width: 100%">
                <el-option
                  v-for="dict in dictMap.CIS_CODE"
                  :key="dict.value"
                  :label="`${dict.value}-${dict.text}`"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="业务拒绝原因：" prop="rejectContent">
              <el-input type="textarea" v-model="formData.rejectContent" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="回执发送时间：" prop="bizRtSndTime">
              <el-date-picker
                v-model="formData.bizRtSndTime"
                type="datetime"
                value-format="yyyyMMddHHmmss"
                placeholder=""
                disabled
                style="width: 100%"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="回执接收时间：" prop="bizRtRcvTime">
              <el-date-picker
                v-model="formData.bizRtRcvTime"
                type="datetime"
                value-format="yyyyMMddHHmmss"
                placeholder=""
                disabled
                style="width: 100%"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
      </el-card>
      <el-card class="form-card txnInfo-card">
        <el-row>
          <el-col :span="12">
            <el-form-item label="录入操作员：" prop="mdTlrno">
              <el-input v-model="formData.mdTlrno" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="录入时间：" prop="mdTime">
              <el-date-picker
                v-model="formData.mdTime"
                type="datetime"
                value-format="yyyyMMddHHmmss"
                placeholder=""
                disabled
                style="width: 100%"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="审核操作员：" prop="audTlrno">
              <el-input v-model="formData.audTlrno" placeholder="" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="审核时间：" prop="audTime">
              <el-date-picker
                v-model="formData.audTime"
                type="datetime"
                value-format="yyyyMMddHHmmss"
                placeholder=""
                disabled
                style="width: 100%"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="通讯状态：" prop="comStatus">
              <el-select v-model="formData.comStatus" placeholder="请选择" style="width: 100%" :disabled="true">
                <el-option
                  v-for="dict in dictMap.PKG_STATUS"
                  :key="dict.value"
                  :label="`${dict.value}-${dict.text}`"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="业务状态：" prop="status">
              <el-select v-model="formData.status" placeholder="请选择" style="width: 100%" :disabled="true">
                <el-option
                  v-for="dict in dictMap.TXN_STATUS"
                  :key="dict.value"
                  :label="`${dict.value}-${dict.text}`"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="中心状态：" prop="procStatus">
              <el-select v-model="formData.procStatus" placeholder="请选择" style="width: 100%" :disabled="true">
                <el-option
                  v-for="dict in dictMap.PROCESSSTATUS"
                  :key="dict.value"
                  :label="`${dict.value}-${dict.text}`"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="业务处理码：" prop="procCode">
              <el-input v-model="formData.procCode" placeholder="" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="报文发送时间：" prop="sndTime">
              <el-date-picker
                v-model="formData.sndTime"
                type="datetime"
                value-format="yyyyMMddHHmmss"
                placeholder=""
                disabled
                style="width: 100%"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="报文接收时间：" prop="rcvTime">
              <el-date-picker
                v-model="formData.rcvTime"
                type="datetime"
                value-format="yyyyMMddHHmmss"
                placeholder=""
                disabled
                style="width: 100%"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
      </el-card>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="closeFn">关闭</el-button>
    </div>
  </el-dialog>
</template>
<script>
import { detailsApiUrlConfig } from "@/api/cnaps/bepsDraft/realtime_debits_operations_query.js";
export default {
  name: "RealtimeDebitsOperationsQueryDetails",
  components: {},
  props: {
    dictMap: {
      type: Object,
      default: () => {
        return {};
      },
    },
    formData: {
      type: Object,
      default: () => {
        return {};
      },
    },
  },
  data() {
    return {
      reqConfig: detailsApiUrlConfig,
      // 查询参数
      queryParams: {
        id: "",
      },
      tableBindColumns: [
        {
          label: `被背书人名称`,
          prop: "endorserName",
          width: "1000",
          align: "center",
        },
      ],
      // 是否显示弹出层
      open: false,
      isLoading: false,
    };
  },
  mounted() {},
  watch: {
    formData: function (newData) {
      if (newData.bizTypeCode ==="D203" || newData.bizTypeCode ==="D204" || newData.bizTypeCode ==="D205" || newData.bizTypeCode ==="D206") {
        this.queryParams.id = newData.id;
        this.$nextTick(() => {
          this.$refs.dataTable.doQuery();
        });
      }
    },
  },
  methods: {
    // 表单重置
    reset() {
      this.resetForm("detailsForm");
    },
    closeFn() {
      this.open = false;
      this.reset();
    },
    show() {
      this.open = true;
    },
  },
};
</script>
<style>
.label-header-msg {
  font-weight: bold;
}

.form-card {
  margin-bottom: 10px;
}
</style>
